import React from 'react';

// 受控组件
class App extends React.Component{
    constructor(props){
      super(props)
      this.state={
        value:'apple'
      };
      this.handleChange=this.handleChange.bind(this);
      this.handleSubmit=this.handleSubmit.bind(this);
      
    }
handleChange(event){
  // event.target 属性可以用来实现事件委托 (event delegation)。
  this.setState({value:event.target.value});
}

handleSubmit(event){
  alert('提交的名字'+this.state.value)
  // event.prevebtDefault();??????
  
}


  render(){
   return(

    <form onSubmit={this.handleSubmit}>
      <label>
        你喜欢的水果：
          <select value={this.state.value} onChange={this.handleChange}>
            <option value='apple'>苹果</option>
            <option value='applee'>苹果1</option>
            <option value='appleee'>苹果2</option>
            <option value='appleeee'>苹果3</option>
          </select>
      </label>
      <input type='submit' value='提交' />
    </form>


   )
}
}

export default App;
